<template>
  <el-dialog
    v-model="visible"
    v-if="load"
    title="提交审核"
    width="600"
    draggable
    @close="close"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :z-index="2000"
  >
    <template #default>
      <el-form
        ref="formRef"
        :model="form"
        :rules="rules"
        label-width="80"
        label-position="top"
        @keydown.enter.stop
        @submit.prevent
      >
        <el-form-item label="开发人员审核" prop="reviewerId">
          <select-personnel
            class="w-full"
            v-model="form.reviewerId"
            placeholder="添加人"
          ></select-personnel>
        </el-form-item>
        <el-form-item label="">
          <el-checkbox v-model="form.isNotify" label="消息通知审核人员" size="large" />
        </el-form-item>
      </el-form>
    </template>
    <template #footer>
      <el-button @click="close">取 消</el-button>
      <el-button type="primary" :loading="loading" @click="save(formRef)"
        >保 存</el-button
      >
    </template>
  </el-dialog>
</template>
<script setup name="SubmitAudit">
import { submitReview } from "../api";

import { reactive, toRefs, getCurrentInstance } from "vue";
import { ElMessage } from "element-plus";

const { proxy } = getCurrentInstance();
const emits = defineEmits(["query"]);
const data = reactive({
  form: {
    skuIds: [],
    reviewerId: "",
    isNotify: false,
  },
  visible: false,
  loading: false,
  formRef: null,
  options: [],
  rules: {
    reviewerId: [{ required: true, message: "请选择开发人员" }],
  },
  load: false,
});
const { rules, form, visible, loading, formRef, options, load } = toRefs(data);
const open = async (skuIds) => {
  if (!load.value) {
    load.value = true;
    await 1;
  }
  if (skuIds) form.value.skuIds = skuIds;
  visible.value = true;
};
const save = () => {
  if (!formRef.value) return;
  formRef.value.validate(async (valid) => {
    if (valid) {
      loading.value = true;
      try {
        const res = await submitReview(form.value);
        ElMessage.success(res.message);
        emits("query");
        close();
      } catch (e) {
        throw Error(e);
      } finally {
        loading.value = false;
      }
      // submitReview(form.value)
      //   .then((res) => {
      //     ElMessage.success(res.message)
      //     emits('query')
      //     close()
      //   })
      //   .finally(() => {
      //     loading.value = false
      //   })
    }
  });
};
const close = () => {
  proxy.resetForm("formRef");
  visible.value = false;
};
defineExpose({ open });
</script>
